{% raw %}
  <script type="text/x-template" class="product-box-temp">
    <div class="">
      {% for item in data %}
        {% capture product_handle %}/products/{{ item.handle }}?data_from={{item.data_from | default:data_from}}{% endcapture %}
        <a class="df-flex df-py-5 md:df-mx-8 df-mx-5 df-items-center product-item" href="{{product_handle}}">
          <img data-src="{{item.image.src|public_front_asset_url}}" src="{{ 'product_empty.png' | public_asset_abs_dir_url }}" class="df-h-20 df-w-20 df-flex-shrink-0 df-object-cover" alt="">
          <div class="">
            <div class="line-clamp2 text-left df-ml-5">{{ item.highlight_title | default : item.title }}</div>
            <div class="df-mt-2 df-flex df-flex-wrap df-items-center">
              <span class="general_buying-color df-ml-5">{{item.variant.price | money}}</span>
              {% if item.variant.compare_at_price != 0 %}
                {%- if item.variant.compare_at_price > item.variant.price -%}
                  <span class="general_original-color df-ml-5">{{item.variant.compare_at_price | money}}</span>
                {%- endif -%}
              {% endif %}
            </div>
          </div>
        </a>
      {% endfor %}
    </div>
  </script>
  <script type="text/x-template" class="collection-box-temp">
    <div class="">
      {% for item in data %}
        {% capture product_handle %}/collections/{{ item.handle }}?data_from={{item.data_from | default:data_from}}{% endcapture %}
        <a class="df-flex df-py-5 md:df-mx-8 df-mx-5 df-items-center product-item" href="{{product_handle}}">
          <img data-src="{{item.src|public_front_asset_url}}" src="{{ 'product_empty.png' | public_asset_abs_dir_url }}" class="df-h-20 df-w-20 df-object-cover df-flex-shrink-0" alt="">
          <div class="df-ml-5">
            <div class="line-clamp2 text-left">{{ item.highlight_title | default : item.title }}</div>
          </div>
        </a>
      {% endfor %}
    </div>
  </script>
  <script type="text/x-template" class="page-box-temp">
    <div class="">
      {% for item in data %}
        {% capture product_handle %}/pages/{{ item.handle }}?data_from={{item.data_from | default:data_from}}{% endcapture %}
        <a class="df-flex df-py-5 md:df-mx-8 df-mx-5 df-items-center product-item" href="{{product_handle}}">
          <img src="{{ 'page_empty.png' | public_asset_abs_dir_url }}" class="df-h-5 df-w-4 df-flex-shrink-0" alt="">
          <div class="df-ml-3">
            <div class="line-clamp2 text-left">{{ item.highlight_title | default : item.title }}</div>
          </div>
        </a>
      {% endfor %}
    </div>
  </script>
  <script type="text/x-template" class="post-box-temp">
    <div class="">
      {% for item in data %}
        {% capture product_handle %}/blogs/{{ item.handle }}?data_from={{item.data_from | default:data_from}}{% endcapture %}
        <a class="df-flex df-py-5 md:df-mx-8 df-mx-5 df-items-center product-item" href="{{product_handle}}">
          <img data-src="{{item.src|public_front_asset_url}}" src="{{ 'blog_empty.png' | public_asset_abs_dir_url }}" class="df-h-20 df-w-20 df-flex-shrink-0" alt="">
          <div class="df-ml-5">
            <div class="line-clamp2 text-left">{{ item.highlight_title | default : item.title }}</div>
          </div>
        </a>
      {% endfor %}
    </div>
  </script>
  <script type="text/x-template" class="topic-box-temp">
    <div class="">
      {% for item in data %}
        {% capture product_handle %}/topics/{{ item.handle }}?data_from={{item.data_from | default:data_from}}{% endcapture %}
        <a class="df-flex df-py-5 md:df-mx-8 df-mx-5 df-items-center product-item" href="{{product_handle}}">
          <img data-src="{{item.src|public_front_asset_url}}" src="{{ 'topic_empty.png' | public_asset_abs_dir_url }}" class="df-h-20 df-w-20 df-flex-shrink-0" alt="">
          <div class="df-ml-5">
            <div class="line-clamp2 text-left">{{ item.highlight_title | default : item.title }}</div>
          </div>
        </a>
      {% endfor %}
    </div>
  </script>
  <script type="text/x-template" class="promotion-box-temp">
    <div class="">
      {% for item in data %}
        {% capture product_handle %}/promotions/{{ item.handle }}?data_from={{item.data_from | default:data_from}}{% endcapture %}
        <a class="df-flex df-py-5 md:df-mx-8 df-mx-5 df-items-center product-item" href="{{product_handle}}">
          <svg t="1696560711216" class="icon df-flex-shrink-0" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1508" width="64" height="64"><path d="M520 240a280 280 0 0 0-197.984 477.984 280 280 0 0 0 395.968-395.968A278.16 278.16 0 0 0 520 240m0-32A312 312 0 1 1 208 520 312 312 0 0 1 520 208z" p-id="1509"></path><path d="M449.984 404.848a45.136 45.136 0 1 1-45.136 45.136 45.184 45.184 0 0 1 45.136-45.136z m0 58.256a13.136 13.136 0 1 0-13.136-13.12 13.152 13.152 0 0 0 13.136 13.12z" p-id="1510"></path><path d="M607.792 560.224a47.568 47.568 0 1 1-47.568 47.568 47.616 47.616 0 0 1 47.568-47.568z m0 63.12a15.568 15.568 0 1 0-15.568-15.552 15.584 15.584 0 0 0 15.568 15.552z" p-id="1511"></path><path d="M416 655.328a16 16 0 0 1-11.312-27.312l223.328-223.328a16 16 0 0 1 22.624 22.624L427.312 650.64a16 16 0 0 1-11.312 4.688z" p-id="1512"></path></svg>
          <div class="df-ml-5">
            <div class="line-clamp text-left">{{ item.highlight_title | default : item.title }}</div>
            <div class="df-mt-2 df-flex df-flex-wrap df-items-center df-gap-2">
              {% capture promotion_endtime %}
                  {% if item.ends_at == -1 %}
                    {{lang.coupon.no_expiration_date}}
                  {% else %}
                    {{item.ends_at | date: "%Y-%m-%d"}}
                  {% endif %}
                {% endcapture %}
               
              <div class="promotion_time">
                <svg t="1696494758625" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7133" width="18" height="18"><path d="M512 960c-249.6 0-448-198.4-448-448s198.4-448 448-448 448 198.4 448 448-198.4 448-448 448zM512 128C300.8 128 128 300.8 128 512s172.8 384 384 384 384-172.8 384-384-172.8-384-384-384z" p-id="7134"></path><path d="M736 512H512V288c0-19.2-12.8-32-32-32s-32 12.8-32 32v256c0 19.2 12.8 32 32 32h256c19.2 0 32-12.8 32-32s-12.8-32-32-32z" p-id="7135"></path></svg> {{item.starts_at | date: "%Y-%m-%d"}} - {{promotion_endtime}}
              </div>
            </div>
          </div>
        </a>
      {% endfor %}
    </div>
  </script>
  <script type="text/x-template" class="coupon-box-temp">
    <div class="">
      {% for item in data %}
        {% capture product_handle %}/coupons/{{ item.handle }}?data_from={{item.data_from | default:data_from}}{% endcapture %}
        <a class="df-flex df-py-5 md:df-mx-8 df-mx-5 df-items-center product-item" href="{{product_handle}}">
          <svg t="1696560644717" class="icon df-flex-shrink-0" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1361" width="64" height="64"><path d="M240 738a16 16 0 0 1-16-16V577.6a16 16 0 0 1 10.624-15.056 61.056 61.056 0 0 0 40.272-57.6 61.088 61.088 0 0 0-40.272-57.6 16 16 0 0 1-10.624-14.96V288a16 16 0 0 1 16-16h560a16 16 0 0 1 16 16v144.384a16 16 0 0 1-10.624 15.056 61.248 61.248 0 0 0 0 115.104A16 16 0 0 1 816 577.6v144.384a16 16 0 0 1-16 16z m16-316.128a93.28 93.28 0 0 1 50.912 83.2A93.264 93.264 0 0 1 256 588.128v117.872h528v-117.872a93.312 93.312 0 0 1 0-166.256V304H256z m140.704 182.4a16 16 0 0 1 0-22.624l200.912-200.96a16 16 0 1 1 22.624 22.624L419.328 604.24a16 16 0 0 1-22.624 0z m127.776-47.76a48 48 0 1 1 48 48 48 48 0 0 1-48.016-48.032z m32 0a16 16 0 1 0 16-16 16 16 0 0 0-16.016 15.968z m-160-128a48 48 0 1 1 48 48 48 48 0 0 1-48.016-48.048z m32 0a16 16 0 1 0 16-16 16 16 0 0 0-16 15.952z" p-id="1362"></path></svg>
          <div class="df-ml-5">
            <div class="line-clamp text-left">{{ item.highlight_title | default : item.title }}</div>
            <div class="df-mt-2 df-flex df-flex-wrap df-items-center df-gap-2">
              <div class="code_box">
                <span>{{lang.coupons.code}}:</span>
                <span class="code" data-clipboard-text="{{item.coupon_code}}">
                  <span class="code_text">{{item.coupon_code}}</span>
                  <span class="copy_svg">
                    <svg t="1683170259462" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15276" width="12" height="12"><path d="M768 256V0H0v768h256v256h768V256h-256zM128 128h512v512H128V128z m768 768H384v-128h384V384h128v512z" fill="currentColor" p-id="15277"></path></svg>
                  </span>
                </span>
              </div>
              <div class="coupon_time">
                {% capture coupon_endtime %}
                  {% if item.ends_at == -1 %}
                    {{lang.coupon.no_expiration_date}}
                  {% else %}
                    {{item.ends_at | date: "%Y-%m-%d"}}
                  {% endif %}
                {% endcapture %}
                <svg t="1696494758625" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7133" width="18" height="18"><path d="M512 960c-249.6 0-448-198.4-448-448s198.4-448 448-448 448 198.4 448 448-198.4 448-448 448zM512 128C300.8 128 128 300.8 128 512s172.8 384 384 384 384-172.8 384-384-172.8-384-384-384z" p-id="7134"></path><path d="M736 512H512V288c0-19.2-12.8-32-32-32s-32 12.8-32 32v256c0 19.2 12.8 32 32 32h256c19.2 0 32-12.8 32-32s-12.8-32-32-32z" p-id="7135"></path></svg> {{item.starts_at | date: "%Y-%m-%d"}} - {{coupon_endtime}}
              </div>
            </div>
          </div>
        </a>
      {% endfor %}
    </div>
  </script>
{% endraw %}